<template>
  <div class="risk-assessment-management" v-if="isReload">
    <t-space direction="vertical" style="width: 100%">
      <dashboard-box :options="dashboardOptions" title="我的待办" />
      <card title="评估任务">
        <template #actions>
          <t-button @click="startHandle">
            <template #icon>
              <play-circle-filled-icon size="20px" />
            </template>
            启动评估
          </t-button>
        </template>
        <management-table />
      </card>
    </t-space>
  </div>
</template>

<script>
import DashboardBox from '@/components/DashboardBox/index.vue';
import Card from '@/components/Card/index.vue';
import ManagementTable from './components/ManagementTable.vue';
import { PlayCircleFilledIcon } from 'tdesign-icons-vue';
import { requestQsListCount } from '@/service/risk-assessment/management';

export default {
  name: 'riskAssessmentManagement',
  components: { DashboardBox, Card, ManagementTable, PlayCircleFilledIcon },
  provide() {
    return {
      reload: this.reload,
    };
  },
  data() {
    return {
      // 面板数据展示配置
      dashboardOptions: [
        {
          count: 0,
          title: '评估待办',
        },
        {
          count: 0,
          title: '待填写',
        },
        {
          count: 0,
          title: '待审核',
        },
        {
          count: 0,
          title: '已超时',
        },
      ],
      isReload: true,
    };
  },
  mounted() {
    this.getcounts();
    this.$bus.$on('updateDashboard', () => {
      this.getcounts();
    });
  },
  methods: {
    reload() {
      this.isReload = false;
      this.$nextTick(() => {
        this.isReload = true;
      });
    },
    startHandle() {
      this.$router.push('/risk-assessment/management/start');
    },
    async getcounts() {
      const res = await requestQsListCount();
      this.dashboardOptions[0].count = res.taskCount;
      this.dashboardOptions[1].count = res.pendAnswer;
      this.dashboardOptions[2].count = res.pendReview;
      this.dashboardOptions[3].count = res.expired;
    },
  },
};
</script>
